<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>测试</title>
		<link rel="stylesheet" href="css/style.css" />
	</head>
	<body>
		<div class="usual">
			<div id="tabs2" class="show">
				<h3>Digital I/O</h3>
				<div class="io">
					<h3>On-board LED Status</h3>
					<div>
						<ul>
							<li>LED0
								<span name="led" class="onboard-led led-off"></span>
								<span name="ledset" class="do-led" pin="90">
									<button name="ledset-btn" class="btn btn-on" pin="90" onclick="postdata(this);">On / Off</button>
								</span>
							</li>
							<li>LED1
								<span name="led" class="onboard-led led-off"></span>
								<span name="ledset" class="do-led" pin="91">
									<button name="ledset-btn" class="btn btn-on" pin="91" onclick="postdata(this);">On / Off</button>
								</span>
							</li>
						</ul>
					</div>
				</div>
				<div>
					<h3>Digital I/O Status</h3>
					<div class="io">
						<ul>
							<li>D0:
								<span name="iodir" class="io-dir"></span>
								<span name="din" class="di-led di-off"></span>
								<span name="dout" class="do-led" size="10" pin="0">
									<button name="dout-btn" class="btn btn-on" pin="0" onclick="postdata(this);">On / Off</button>
								</span>
							</li>
							<li>D1:
								<span name="iodir" class="io-dir"></span>
								<span name="din" class="di-led di-on"></span>
								<span name="dout" class="do-led" size="9" pin="1">
									<button name="dout-btn" class="btn btn-on" pin="1" onclick="postdata(this);">On / Off</button>
								</span>
							</li>
							<li>D2:
								<span name="iodir" class="io-dir"></span>
								<span name="din" class="di-led di-off"></span>
								<span name="dout" class="do-led" size="8" pin="2">
									<button name="dout-btn" class="btn btn-on" pin="2" onclick="postdata(this);">On / Off</button>
								</span>
							</li>
							<li>D3:
								<span name="iodir" class="io-dir"></span>
								<span name="din" class="di-led di-off"></span>
								<span name="dout" class="do-led" pin="3">
									<button name="dout-btn" class="btn btn-on" pin="3" onclick="postdata(this);">On / Off</button>
								</span>
							</li>
						</ul>
					</div>
				</div>
			</div>
		</div>
	</body>
	<script type="text/javascript" src="js/app.min.js"></script>
	<script>
		function postdata(o) {
			var p = o.attributes['pin'].value;
			console.log(p);
			var v = 0;
			if (o.className == 'btn btn-on width-onoff') {
				v = '1';
			} else {
				v = '0';
			}
			dout_timer = setTimeout(function() {
				if (dout && dout.abort) {
					dout.abort();
				}
				dout = new AJAX('dout.cgi', function(t) {
					try {
						eval(t);
						if (t == '1') {
							o.setAttribute('class', 'btn btn-on width-onoff');
						} else {
							o.setAttribute('class', 'btn btn-off width-onoff');
						}
					} catch (e) {
						alert(e);
					}
				});
				dout.doPost('pin=' + p + '&val=' + v);
			}, 300);
		}
		var oled = $$_ie('span', 'led');
		for (i = 0; i < oled.length; i++) {
			console.log(oled[i].className);
		}
		oled[0].className = "onboard-led led-off";
	</script>
</html>
